<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>我的页面</title>
	</head>
	<body>
		<!-- 主体 -->
		<main>
			<!-- 用户名与个性签名 -->
			<section class="ui">
				<!-- 头像 -->
				<a href="mine_information.html"" id="hp">
					<img src="../../assets/images/9.jpg" alt="图片加载失败" />
				</a>

				<!-- 用户名 -->
				<div class="user">
					<a href="mine_information.html" id="username">用户名</a>
				</div>

				<!-- 个性签名 -->
				<p class="idly" id="idly">
					个性签名：
				</p>
			</section>

			<!-- 运动数据 -->
			<section class="data">
				<!-- 标题盒子-->
				<div class="titlebox">
					<p>
						<!-- 统计图标 -->
						<span class="iconfont icon-statistics"></span>

						<!-- 标题 -->
						<span class="title">运动数据</span>
					</p>

					<!-- 详情链接 -->
					<a href="mine_sports_data.html" class="iconfont icon-xuanzeqixiayige" id="details"></a>
				</div>

				<!-- 数据盒子 -->
				<div class="bigdata">
					<!-- 总运动 -->
					<div class="sporttime">
						<!-- 标题 -->
						<p class="title1">总运动</p>

						<!-- 具体数据 -->
						<p>
							<span class="num1" id="num1">9999</span>
							<span class="time">分钟</span>
						</p>
					</div>

					<!-- 分割线 -->
					<div class="division"></div>

					<!-- 消耗的能量 -->
					<div class="consume">
						<!-- 标题 -->
						<p class="title2">本周消耗</p>

						<!-- 具体数据 -->
						<p>
							<span class="num2" id="num2">9999</span>
							<span class="kilocalorie">千卡</span>
						</p>
					</div>
				</div>
			</section>

			<!-- 运动徽章 -->
			<section class="badge">
				<!-- 标题盒子-->
				<div class="titlebox2">
					<!-- 标题 -->
					<p>
						<!-- 徽章图标 -->
						<span class="iconfont icon-badge-full"></span>

						<!-- 标题 -->
						<span class="title3">我的运动徽章</span>
					</p>

					<!-- 详情链接 -->
					<a
						href="mine_badge.html"
						class="iconfont icon-xuanzeqixiayige"
						id="particulars"
					></a>
				</div>

				<!-- 徽章盒子 -->
				<div class="badgebox">
					<a href="mine_badge.html" id="badge1">
						<img src="../../assets/images/mybadge01.jpg" alt="图片加载失败" />
					</a>
					<a href="mine_badge.html" id="badge2">
						<img src="../../assets/images/mybadge02.jpg" alt="图片加载失败" />
					</a>
					<a href="mine_badge.html" id="badge3">
						<img src="../../assets/images/mybadge03.jpg" alt="图片加载失败" />
					</a>
				</div>
			</section>
			<!-- 退出登录按钮 -->
			<section class="quit">
				<!-- 按钮 -->
				<button type="button" id="btn">退出登录</button>
			</section>
		</main>
		<!-- 导航栏 -->
		<nav class="tabber"></nav>
	</body>
</html>
